drop: (item, monitor) => addTaskToSprint(item.id, monitor, drop)
length: 2
name: "drop"
arguments: (...)
caller: (...)
[[FunctionLocation]]: SprintCard.jsx:45
[[Prototype]]: ƒ ()
[[Scopes]]: Scopes[3]
0: Closure (SprintCard)
ItemType: "Task Card"
addTaskToSprint: (id, monitor, dropTargetProps, task) => {…}
drop: ƒ ()
My api response looks like this,
I need to access [[Scopes]] so I can get the ItemType variable
drop is a function so accessing the scope like so (spec.drop.scopes) won't work
when I console.log(spec.drop) it shows the function declaration only
So is there any way to have access scopes?
[[Scopes]] isn't a part of the object, it's a category devtools uses to show what environment record objects a function closes over. The drop function has access to ItemType, but other code doesn't get access to ItemType via drop unless drop provides that access in some way. More generally, code with access to a function doesn't necessarily have access to the things that function has access to (in fact, it often doesn't).
Here's a simpler example:
function counter() {
let value = 0;
const increment = () => ++value;
return increment;
}
function example() {
const increment = counter();
console.log(increment()); // Shows "1"
console.log(increment()); // Shows "2" -- that is, the `increment`
// function closes over `value` so it
// can use it to return an incrementing
// counter
// There's no way for code here to directly access the `value` that
// `increment` closes over.
}
example();The increment function has access to value, but the example function does not, even though it has access to increment.